<div class="feed-messages-container">
    <div class="feed-message" *ngFor="let message of feed" (click)="expandMessage(message)">
        <div class="message-icon" *ngIf="message.type == 'text-message'">
            <img class="photo-icon" src="{{ pathToImages( message.author | baProfilePicture ) }}">
        </div>
        <div class="message-icon" *ngIf="message.type != 'text-message'">
            <img class="photo-icon" src="{{ pathToImages( message.author | baProfilePicture ) }}">
            <span class="sub-photo-icon" [ngClass]="message.type"></span>
        </div>
        <div class="text-block text-message">
            <div class="message-header">
                <span class="author">{{ message.author }} {{ message.surname}}</span>
            </div>{{ message.text }}
            <div class="message-content line-clamp" [ngClass]="{'line-clamp-2' : !message.expanded}">
                <span *ngIf="message.preview">{{ message.header }} </span>{{ message.text }}
            </div>
            <div class="preview" [ngClass]="{'hidden': !message.expanded}" *ngIf="message.preview">
                <a href="{{ message.link }}" target="_blank">
          <img src="{{ pathToImages( message.preview | baAppPicture )}}">
        </a>
            </div>
            <div [ngClass]="{'hidden': !message.expanded}" class="message-time">
                <div class="post-time">
                    {{ message.time }}
                </div>
                <div class="ago-time">
                    {{ message.ago }}
                </div>
            </div>
        </div>
    </div>
</div>
